<template>
  <div class="paddingTop search_page">
    <head-top head-title="动态" goBack="true" name="top"></head-top>
    <!-- <form class="search_form">
      <input type="search" name="search" placeholder="请输入商家或美食名称" class="search_input" />
      <input type="submit" name="submit" class="search_submit" @click.prevent="searchTarget('')" />
    </form>-->
    <!--动态展示-->
    <div class="shoplist_container" style="margin-top:1rem;">
      <ul>
        <router-link
          :to="{path: '', query:{}}"
          v-for="item in dynamicList"
          tag="li"
          :key="item.id"
          class="shop_li"
        >
          <hgroup class="shop_right" style="border-bottom:2px solid gray;margin-top:1rem">
            <h5 class="shop_title ellipsis" style="margin-left:0.4rem">{{item.createPerson}}</h5>
            <header class="shop_detail_header" style="margin-left:1rem;margin-top:0.5rem">
              <!-- <router-link :to="'/dynamicDetail/'+item.id"> -->
              <h4 class="shop_title ellipsis" @click="dynamicDetail(item.id)">{{item.title}}</h4>
              <!-- </router-link> -->
            </header>
            <h5 class="rating_order_num" style>
              <section class="rating_order_num_left" style="margin-top:0.5rem;margin-left:1.5rem">
                <section class="rating_section">
                  <img :src="item.images" style="width:5rem;margin-left:1rem；height:5rem" @click="dynamicDetail(item.id)"/>
                </section>
                <!-- <section class="order_section">:{{item.content}}</section> -->
              </section>
              <section class="rating_order_num_right"></section>
            </h5>
            <h5 class="fee_distance">
              <p class="distance_time" style="margin-left:1rem">
               
          
                    <svg
                      t="1600073965970"
                      class="icon"
                      viewBox="0 0 1024 1024"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      p-id="2782"
                      width="0.7rem"
                      height="0.7rem"
                      @click="likenunadd(item.id,item.likenum)"
                    >
                      <path
                        d="M884.875894 423.143253 646.970506 423.143253c92.185562-340.464205-63.516616-357.853247-63.516616-357.853247-65.993017 0-52.312436 52.182476-57.3031 60.881602 0 166.502152-176.849824 296.971645-176.849824 296.971645l0 472.171899c0 46.607504 63.516616 63.393819 88.433098 63.393819l357.452111 0c33.641191 0 61.036122-88.224344 61.036122-88.224344 88.434122-300.70569 88.434122-390.177444 88.434122-390.177444C944.657442 418.179195 884.875894 423.143253 884.875894 423.143253L884.875894 423.143253 884.875894 423.143253zM884.875894 423.143253"
                        p-id="2783"
                      />
                      <path
                        d="M251.671415 423.299819 109.214912 423.299819c-29.420053 0-29.873378 28.89612-29.873378 28.89612l29.420053 476.202703c0 30.309306 30.361495 30.309306 30.361495 30.309306L262.420223 958.707948c25.686009 0 25.458835-20.049638 25.458835-20.049638L287.879058 459.411271C287.879058 422.837284 251.671415 423.299819 251.671415 423.299819L251.671415 423.299819 251.671415 423.299819zM251.671415 423.299819"
                        p-id="2784"
                      />
                    </svg>
                 
                  {{item.likenum}}
            
                <span style="margin-left:0.5rem;top:0.5rem">
                  <svg
                    t="1599103639818"
                    class="icon"
                    viewBox="0 0 1035 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="2751"
                    width="0.7rem"
                    height="0.7rem"
                  >
                    <path
                      d="M905.898667 44.032 129.365333 44.032c-71.338667 0-129.365333 58.026667-129.365333 129.365333l0 518.144c0 71.338667 58.026667 129.365333 129.365333 129.365333l253.952 0 134.144 163.84 133.802667-163.84 254.293333 0c71.338667 0 129.365333-58.026667 129.365333-129.365333L1034.922667 173.397333C1035.264 102.058667 977.237333 44.032 905.898667 44.032L905.898667 44.032 905.898667 44.032zM236.885333 498.005333c-34.474667 0-62.464-27.989333-62.464-62.464 0-34.474667 27.989333-62.464 62.464-62.464 34.474667 0 62.464 27.989333 62.464 62.464C299.349333 470.016 271.36 498.005333 236.885333 498.005333L236.885333 498.005333 236.885333 498.005333zM518.144 498.005333c-34.474667 0-62.464-27.989333-62.464-62.464 0-34.474667 27.989333-62.464 62.464-62.464 34.474667 0 62.464 27.989333 62.464 62.464C580.608 470.016 552.618667 498.005333 518.144 498.005333L518.144 498.005333zM799.402667 498.005333c-34.474667 0-62.464-27.989333-62.464-62.464 0-34.474667 27.989333-62.464 62.464-62.464 34.474667 0 62.464 27.989333 62.464 62.464C861.866667 470.016 833.877333 498.005333 799.402667 498.005333L799.402667 498.005333zM799.402667 498.005333"
                      p-id="2752"
                    />
                  </svg>
                  {{item.commentnum}}
                </span>
                <span
                  class="order_time"
                  style="font-size:0.55rem;float:right;margin-right:0.8rem;margin-top:0.2rem;color:gray"
                >{{item.createTime}}</span>
              </p>
            </h5>
          </hgroup>
        </router-link>
      </ul>
    </div>
    <!-- <section @click="dynamicadd()"> -->
    <router-link to="/dynamicAdd">
      <button>
        <img
          class="add"
          :src="image"
          style="float:right;position: fixed;bottom: 6rem;right: 2.2rem;z-index: 9999;width:3rem;height:3rem;"
        />
      </button>
    </router-link>
    <!-- <router-view></router-view> -->
    <foot-guide></foot-guide>
  </div>
</template>

<script>
import headTop from "../../components/header/head";
import footGuide from "../../components/footer/footGuide";
import { searchRestaurant } from "../../service/getData";
import { imgBaseUrl } from "../../config/env";
import { getStore, setStore } from "../../config/mUtils";

export default {
  data() {
    return {
      url: "http://172.16.9.12:8081/house/dynamic/updateLikeNum",
      dynamicList: [],
      image: require("src/images/12.png"),
      id:sessionStorage.getItem("userId"),
      
    };
  },
  created() {
    var vm = this;
    this.axios({
      method: "GET",
      url: "http://172.16.9.12:8081/house/dynamic/selectAllDynamic",
      params: vm.dynamicList,
    }).then(function (res) {
      console.log(vm.id);
      vm.dynamicList = res.data.data.dynamicList;
    });
    // this.axios({
    //   method:"get",
    //   url:"http://172.16.9.12:8081/getUserById",
    //   params:{
        
    //   }
    // }).then(function(res){
    //   console.log(id)
    // });
  },
  methods: {
    
    dynamicDetail(id) {
      this.$router.push("/dynamicDetail/" + id);
    },
    likenunadd(id, likenum) {
      console.log(id);
      this.axios
        .get(this.url, {
          params: {
            id: id,
          },
        })
        .then((res) => {
          console.log(res);
        });

    //   var vm = this.axios({
    //     method: "get",
    //     params: {
    //       id: this.dynamicList.id,
    //     },
    //     url: "http://localhost:8081/house/dynamic/updateLikeNum",
    //   }).then(function () {
    //     console.log(id);
    //   });
    },
  },

  components: {
    headTop,
    footGuide,
  },
};
</script>

<style lang="scss" scoped>
@import "../../style/mixin";

.search_page {
  margin-bottom: 2rem;
}
.search_form {
  background-color: #fff;
  padding: 0.5rem;
  display: flex;
  input {
    height: 1.5rem;
  }
  .search_input {
    flex: 4;
    border: 0.025rem solid $bc;
    @include sc(0.65rem, #333);
    border-radius: 0.125rem;
    background-color: #f2f2f2;
    font-weight: bold;
    padding: 0 0.25rem;
  }
  .search_submit {
    flex: 1;
    border: 0.025rem solid $blue;
    margin-left: 0.2rem;
    @include sc(0.65rem, #fff);
    border-radius: 0.125rem;
    background-color: $blue;
    font-weight: bold;
    padding: 0 0.25rem;
  }
}
.title_restaurant {
  font-size: 0.6rem;
  line-height: 2rem;
  text-indent: 0.5rem;
  font-weight: bold;
  color: #666;
}
.list_container {
  background-color: #fff;
}
.list_li {
  display: flex;
  justify-content: "center";
  padding: 0.5rem;
  border-bottom: 0.025rem solid $bc;
  .item_left {
    margin-right: 0.25rem;
    .restaurant_img {
      @include wh(1.7rem, 1.7rem);
    }
  }
  .item_right {
    font-size: 0.55rem;
    flex: 1;
    .item_right_text {
      padding-bottom: 0.25rem;
      border-bottom: 0.025rem solid $bc;
      p {
        line-height: 0.9rem;
      }
      .pay_icon {
        margin-bottom: -0.08rem;
      }
    }
    .item_right_detail {
      margin-top: 0.25rem;
      li {
        font-size: 0;
        span {
          font-size: 0.5rem;
          vertical-align: middle;
          display: inline-block;
          margin-bottom: 0.2rem;
        }
        .activities_icon {
          @include sc(0.5rem, #fff);
          font-weight: bold;
          padding: 0.04rem;
          border-radius: 0.15rem;
          margin-right: 0.125rem;
        }
        .only_phone {
          color: #ff6000;
        }
      }
    }
  }
}
.search_history {
  .history_list {
    background-color: #fff;
    border-bottom: 0.025rem solid $bc;
    @include font(0.7rem, 2rem);
    padding: 0 0.3rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .history_text {
      display: inline-block;
      width: 80%;
    }
    .delete_icon {
      @include wh(1rem, 1rem);
    }
  }
  .clear_history {
    background-color: #fff;
    color: $blue;
    @include font(0.7rem, 2rem);
    font-weight: bold;
    text-align: center;
  }
}
.search_none {
  margin: 0 auto;
  @include font(0.65rem, 1.75rem);
  color: #333;
  background-color: #fff;
  text-align: center;
  margin-top: 0.125rem;
}
</style>
